<template>
  <Container class="order-list">
    <div slot="header" class="container-header head-form">
      <Form class="search">
        <Row>
          <i-col span="8">
            <FormItem label="订单编号">
              <Input v-model.trim="list.form.sn" placeholder="订单编号" clearable @on-enter="onSearchBtnClick" />
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="款式/款号">
              <Input v-model.trim="list.form.title" placeholder="款式/款号" clearable @on-enter="onSearchBtnClick" />
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="款式属性">
              <Cascader transfer :data="styleList" v-model="list.form.parameter" :load-data="loadData"></Cascader>
              <!-- <Input v-model.trim="list.form.parameter" placeholder="款式属性" clearable @on-enter="onSearchBtnClick" /> -->
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="完成状态">
              <Select v-model="list.form.is_finish" clearable @on-change="onSearchBtnClick">
                <Option v-for="(item, index) in list.options.is_finish" :key="index" :value="item.value">{{ item.label }}</Option>
              </Select>
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="订单时间">
              <DatePicker v-model="list.form.date" :clearable="false" type="daterange" format="yyyy-MM-dd" split-panels :options="daterangeOptions" placement="bottom-start" placeholder="选择日期"></DatePicker>
              <!-- <DatePicker v-model="list.form.date" :clearable="true" format="yyyy-MM-dd" type="daterange" placement="bottom-start" placeholder="选择日期" /> -->
            </FormItem>
          </i-col>
          <i-col span="2" class-name="search small">
            <Button class="btn-search " type="primary" icon="ios-search" @click="onSearchBtnClick" />
          </i-col>
        </Row>
      </Form>
    </div>
    <div class="holder">
      <div class="left"></div>
      <div class="right">
        <Button  @click="onCreateOrder" type="primary" size="large">创建订单</Button>
      </div>
    </div>
    <div>
      <table cellspacing="0" class="table">
        <thead>
          <tr>
            <th class="pl" width="1%"></th>
            <th v-for="item in list.columns" :key="item.id" :width="item.width">{{ item.title }}</th>
          </tr>
        </thead>
      </table>
      <div class="table-list" @scroll="scrollHandle" :style="{height: options.tableHeight - 30 + 'px'}">
        <template v-if="list.data.length">
          <div v-for="(item, index) in list.data" :key="index" class="list">
            <div class="header" style="position: relative">
              <div class="header-left" >
                <!-- <Checkbox v-model="item.checked" @on-change="onClickChecked(item)" /> -->
                
                <div v-show="item.orderFlagEnum" class="item"><Icon type="ios-flag" :color="item.orderFlagEnum | filterColors" size="20" /></div>
                <div class="item">
                  订单号：<span :id="'orderNumber' + index">{{ item.order_no }}</span>
                  <Button
                    size="small"
                    :data-clipboard-target="'#orderNumber' + index"
                    :data-clipboard-text="item.number"
                    data-clipboard-action="copy"
                    class="btn ml"
                    @click="onCopy(item)"
                  >复制</Button>
                </div>
                <div class="item">下单时间：{{ item.creation_time }}</div>
                <div v-if="item.returnFlag" class="item">
                  订单标记：
                  <span v-if="item.returnFlag" class="tag blue">退</span>
                </div>
                <!-- 聊天 -->
                <div  v-if="item.invite_status == 2" style="position: absolute; right: 20px" @click="onJoinChatItem(item)">
                   <a>聊天室</a> 
                  <a class="xx-big" >
                    <Icon type="ios-chatboxes" />
                  </a>
                </div>
              </div>
              <div v-if="item.thirdPaySn" class="header-right item">
                第三方支付交易流水号：<span :id="'orderNumberSn' + index">{{ item.thirdPaySn }}</span>
                <Button
                  size="small"
                  :data-clipboard-target="'#orderNumberSn' + index"
                  :data-clipboard-text="item.number"
                  data-clipboard-action="copy"
                  class="btn ml"
                  @click="onCopy(item)"
                >复制</Button>
              </div>
            </div>
            <ul class="content">
              <li class="br f5" style="position: relative">
                <div  :key="j" class="infos">
                  <div class="infoInner">
                    <div class="left" style="width: 60%;">
                      <div class="f1">
                        <div class="name">{{ item.title }}</div>
                        <div class="mt">
                          <span v-if="item.isGift" class="tag red">赠</span>
                          <span v-if="item.factoryTags" class="tags blue">{{ item.factoryTags }}</span>
                          <span v-if="item.promotionTags" class="tags red">{{ item.promotionTags }}</span>
                        </div>
                      </div>
                    </div>
                    <div class="right pt" style="width: 25%;">
                      <ul>
                        <li style="cursor: pointer" v-for="(todo, index)  of item.version_info" @click="onClickJoin(item, todo.version_num)" :key="index">
                          <a class="a">{{todo.version_name}}</a> 
                        </li>
                      </ul>
                      <!-- <div class="e2" :title="item.version_list.join(',')">{{ .join(',') }}</span> -->
                    </div>
                    <div class="right pt" style="width: 20%;">
                      <div>{{ item.company_name }}：{{ item.order_user_name }} </div>
                      <!-- <div>设计师：{{ item.order_user_name }}</div> -->
                    </div>
                  </div>
                </div>
              </li>
              <li class="br f1 pl pt">
                {{item.parameter}}
              </li>
              <li class="br f1 pl pt">
                <div v-if="item.step==4 && item.is_comment==1">
                  订单状态：已评价
                </div>
                <div v-else>
                  订单状态：{{item.is_finish | is_finish}}
                </div>
                <div style="cursor: pointer" class="e2" :title="item.user_uploade.join(',')">
                  订单文件：{{item.user_uploade.join(",")}}
                </div>
              </li>
              <li class="br f1 pl pt clear">
                <div v-if="item.consumerRemark">买家留言：{{ item.consumerRemark }}</div>
                <div class="remark">
                  <p>我的需求:</p>
                  {{item.claims}}
                </div>
              </li>
              <li class="f1 pl ">
                <p class="font-blue mb">{{ item.orderStatus | filterOrderStatus }}</p>
                <div v-if="item.payStatus == '1'">
                  <Button type="primary" size="small" class="mb" @click="onRefundType(item)">退货退款</Button>
                </div>
                <Button v-if="item.orderStatus == '0'" type="primary" size="small" class="mb" @click="onOrderCancel(item.sn)">取消</Button>
                <div v-if="item.invite_status == 2 && userInfo.is_admin!==1">
                  <a @click="jumpPage(item)">详情</a>
                </div>
                <!-- <div v-if="item.step == 2">
                  <a @click="jumpMyUpload(item)">我的上传</a>
                </div> -->
                <!-- <div v-if="item.step == 2 || item.step == 3 || item.step == 4">
                  <a @click="jumpView(item)">查看所有</a>
                </div> -->
                <div v-if="(item.invite_status==2 && item.current_company_id !== 0)">
                  <a @click="jumpPage(item, 1)">邀请</a>
                </div>
                <div v-if="item.invite_status == 1">
                  <a @click="onJoinIvalition(item)">接受派单</a>
                </div>
                <div v-if="item.invite_status == 1 && item.is_pay == 1 && item.is_finish == 0">
                  <a @click="onJoinReject(item)">拒绝邀请</a>
                </div>
                <div v-if="item.is_pay == 0">
                  <a @click="onPayment(item)">确认支付</a>
                </div>
                <div v-if="((item.icon.finish.is_show == 1))">
                  <a @click="onComplete(item)">确认结单</a>
                </div>
                <div v-if="item.is_finish == 1 && item.is_pay == 1">
                  <a @click="onRemark(item)">评论</a>
                </div>
                <div v-if="item.sure_finish ==1">
                  <a @click="onRemarkList(item)">所有评论</a>
                </div>
                <div>
                  <a @click="onMemberList(item)">成员列表</a>
                </div>
                <div v-if="(((item.is_send== 0 && item.level>0) || (item.is_send==1 && item.type==2 && item.level>1)) && item.sure_finish ==0)">
                  <a @click="onFormJoin(item)">表单版本</a>
                </div>
                <div v-if="item.icon.apply_over.is_show == 1">
                  <a @click="onApplyFinish(item)">申请结单</a>
                </div>
                <div style="color: #999" v-if="item.type == 2 && item.apply_finish == 1 && item.sure_finish == 0">
                  已申请结单
                </div>
                <div style="color: #999" v-if="item.is_finish == 1">
                  已完结
                </div>
                <div v-if="(item.is_send==0 && item.type==1 && item.sure_finish ==0)">
                  <a @click="onLeaflets(item)">派单</a>
                </div>
                <div v-if="(item.icon.roll_back.is_show == 1)">
                  <a @click="onReport(item)">返回修改</a>
                </div>
                <div v-if="(item.is_send==1 && item.sure_finish==0 && item.type==1 )">
                  <a @click="onCancel(item)">取消</a>
                </div>
                <div v-if="(item.apply_cancel==1 && item.sure_finish ==0 && item.is_send==1 && item.type==2)">
                  <a @click="onCancelAgree(item)">同意取消</a>
                </div>
                <div v-if="(userInfo.is_admin==1)">
                  <a @click="onInvalid(item)">作废</a>
                </div>
                <div v-if="item.icon.down.is_show == 1">
                  <a @click="onloadDown(item)">下载</a>
                </div>
              </li>
            </ul>
            <div class="header">需求方: {{item.need.join(",")}} 。 服务方：{{item.service.join(",")}}</div>
          </div>
        </template>
        <div v-show="!list.data.length" class="empty">暂无数据</div>
      </div>
      <div class="pager">
        <Page
          :total="list.totalItem"
          :current="list.currentPage"
          :page-size="list.pageSize"
          show-sizer
          placement="top"
          @on-change="onPageChange"
          @on-page-size-change="onPageSizeChange"
        />
      </div>
      <Loader :status="list.status" @refresh="onSearchBtnClick" />
      <JoinCompanyitem ref="join" @complete="getData"></JoinCompanyitem>
      <MyUploadItem ref="myUpload1" @complete="getData"></MyUploadItem>
      <VIewUploadItem ref="view"></VIewUploadItem>
      <RemarkListItem ref="remarkList"></RemarkListItem>
      <MemberListItem ref="member"></MemberListItem>
      <FormJoinItem ref="formjoin"></FormJoinItem>
      <LeafletsItem ref="Leaflets"></LeafletsItem>
      <ChatItem ref="chat">
        <Icon  @click="onVideoUpload" slot="file"  class="file-icon" type="md-videocam" /> 
        <Icon  @click="onFileUpload" slot="img"  class="file-icon" type="ios-folder" />
        <Icon  @click="onImgUpload" slot="file"  class="file-icon" type="md-images" />
      </ChatItem>
      <RemarkItem ref="remark" @complete="getData"></RemarkItem>
      <Modal v-model="modal" :width="800" title="我的上传">
          <Form :label-width="160" ref="form">
            <FormItem label="上传图片" >
              <PictureEditItem :uploadList="uploadList" :maxlength="19" upLoadType="image" @uploadPic="uploadPic"></PictureEditItem>
            </FormItem>
          </Form>
        <div slot="footer">
          <Button class="mr" size="large" type="text" @click="closeModal">取消</Button>
          <Button type="primary" size="large"  @click="onSave">发送</Button>
        </div>
      </Modal>
      <Modal v-model="modelFile" :width="800" title="我的上传">
        <Form :label-width="160" ref="form">
          <FormItem label="上传文件" >
            <PictureEditItem :uploadList="uploadFileList" :isLoadChat="true" :maxlength="19" upLoadType="file" @uploadPic="uploadFilePic"></PictureEditItem>
          </FormItem>
        </Form>
        <div slot="footer">
          <Button class="mr" size="large" type="text" @click="closeFileModal">取消</Button>
          <Button type="primary" size="large"  @click="onSaveFile">发送</Button>
        </div>
      </Modal>
      <!-- 上传视频 -->
      <Modal v-model="modelVideo" :width="800" title="我的上传">
        <Form :label-width="160" ref="form">
          <FormItem label="上传视频" >
            <PictureEditItem :uploadList="uploadVideoList" :isLoadChat="true" :maxlength="19" upLoadType="media" @uploadPic="uploadVideoPic"></PictureEditItem>
          </FormItem>
        </Form>
        <div slot="footer">
          <Button class="mr" size="large" type="text" @click="closeVideoModal">取消</Button>
          <Button type="primary" size="large"  @click="onSaveVideo">发送</Button>
        </div>
      </Modal>
    </div>
  </Container>
</template>
<script>
import { formatDate, clearEmpty, downloadFileStream } from '@/util'
import table from '@/table'
import listData from './list/OrderListData'
import JoinCompanyitem from "./edit/JoinCompanyitem"
import MyUploadItem from "./edit/MyUploadItem"
import VIewUploadItem from "./edit/VIewUploadItem"
import ChatItem from "@/components/ChatItem"
import RemarkItem from "./edit/RemarkItem"
import PictureEditItem from "@/components/PictureEditItem"
import RemarkListItem from "./edit/RemarkListItem"
import MemberListItem from "./edit/MemberListItem"
import FormJoinItem from "./edit/FormJoinItem"
import LeafletsItem from "./edit/LeafletsItem"
import { mapGetters } from 'vuex'
import qs from 'qs'
export default {
  name: 'order/order/list',
  components: {
    JoinCompanyitem,
    MyUploadItem,
    VIewUploadItem,
    ChatItem,
    RemarkItem,
    PictureEditItem,
    RemarkItem,
    RemarkListItem,
    MemberListItem,
    FormJoinItem,
    LeafletsItem
  },
  data () {
    return {
      modal: false,
      modelFile: false,
      modelVideo: false,
      list: listData,
      selected: [],
      allCheck: false,
      flagColor: '',
      isDown: false,
      options: {
        tableHeight: 300
      },
      isEdit: false,
      disabled: false,
      src: '/common/store/listStores',
      freightFree: '', //运费
      totalAmount: '',
      orderTotalQuantity: '',
      storeTotalQuantity: '',
      distributorQuantity: '',
      afterSaleQuantity: '',
      afterSaleAmount: '',
      scanStoreQuantity: '',
      scanInQuantity: '',
      singleRowflag: false, //待排单
      uploadList: [],
      uploadFileList: [],
      uploadVideoList: [],
      imgPath: [],
      imgPathFile: [],
      imgPathVideo: [],
      item: {},
      styleList: [{
        value: '1',
        label: '男装',
        children: [],
        loading: false
      }, {
        value: '2',
        label: "女装",
        children: [],
        loading: false
      }, {
        value: '3',
        label: '童装',
        children: [],
        loading: false
      }],
      daterangeOptions: {
        shortcuts: [
          {
            text: '近一周',
            value () {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              return [start, end];
            }
          },
          {
            text: '近一月',
            value () {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              return [start, end];
            }
          },
          {
            text: '近三月',
            value () {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                return [start, end];
            }
          }
        ]
      }
    }
  },
  mounted () {
    this.list.currentPage = ~~this.$route.query.currentPage || 1
    this.list.pageSize = ~~this.$route.query.pageSize || this.list.pageSize
    this.initTable()
    this.getData()

  },
  filters: {
    is_finish(val) {
      let list = {
        '0': "进行中",
        '1': "已完成"
      }
      return list[val]
    },
    step (val) {
      let list = {
        "1": "待付款",
        "2": "接单",
        "3": "完成",
        "4": "待评价"
      }
      return list[val]
    },
    user_type (val) {
      let list = {
        "0": "个人",
        "1": "设计师",
        "2": "制版师",
        "3": "制样师"
      }
      return list[val]
    }
  },
  methods: {
    ...table,
    loadData(item, callback) {
      item.loading = true
      console.log(item)
      this.$ajaxGet(`/order/styleList?style_type=${item.value}`).then(data => {
        item.loading = false
        let child = item.children = data.map((item, index) => {
          return {
            value: item,
            label: item
          }
        })
        this.$set(item, 'children', child)
        callback()
      })
    },
    closeFileModal() {
      this.modelFile = false
    },
    closeVideoModal() {
      this.modelVideo = false
    },
    closeModal() {
      this.modal = false
    },
    onSave() {
      for(let i = 0; i<this.imgPath.length; i++) {
        if (!this.imgPath[i]) delete this.imgPath[i]
      }
      this.imgPath.forEach(item => {
        let param = {
          order_id: this.item.order_id,
          file: item.url,
          type: 2
        }
        this.$refs.chat.send_message(param)
      })
      this.modal = false
    },
    onSaveFile() {
      for(let i = 0; i<this.imgPath.length; i++) {
        if (!this.imgPath[i]) delete this.imgPath[i]
      }
      this.imgPathFile.forEach(item => {
        let param = {
          order_id: this.item.order_id,
          file: item.url,
          type: 3,
          name: item.name
        }
        this.$refs.chat.send_message(param)
      })
      this.modelFile = false
    },
    onSaveVideo() {
      this.imgPathVideo.forEach(item => {
        let param = {
          order_id: this.item.order_id,
          file: item.url,
          type: 4,
          name: item.name
        }
        this.$refs.chat.send_message(param)
      })
      this.modelVideo = false
    },
    uploadPic(value) {
      this.imgPath = value.map(item => {
        return {
          url: item.url,
          type: 2
        }
      })
    },
    uploadFilePic(value) {
       this.imgPathFile = value.map(item => {
        return {
          name: item.name,
          url: item.url,
          type: 3
        }
      })
    },
    uploadVideoPic(value) {
       this.imgPathVideo = value.map(item => {
        return {
          name: item.name,
          url: item.url,
          type: 3
        }
      })
    },
    onImgUpload (item) {
      this.modal = true
      this.uploadList = []
    },
    onFileUpload(item) {
      this.modelFile = true
      this.uploadFileList = []
    },
    onVideoUpload(item) {
      this.modelFile = true
      this.uploadVideoList = []
    },
    onJoinChatItem (item) {
      this.item = item
      this.$refs.chat.open(item)
    },
    onCreateOrder () {
      this.$router.push({ name: 'order/order/edit'})
    },
    onSearchBtnClick () {
      this.list.currentPage = 1
      this.getData()
      // this.getStatisticData()
    },
    isNullUndfined(val) {
      return val === null || val === undefined
    },
    // 获取订单列表
    getData () {
      let text = ''
      if (!this.list.form.date[0] || !this.list.form.date[1] || !this.list.form.date.length) {
        text = '请选择查询日期'
      } 
      // else if ((new Date(this.list.form.date[1]) - new Date(this.list.form.date[0])) / (1000 * 60 * 60 * 24) > 60) {
      //   text = '查询时间间隔不得超过60天'
      // }
      if (text) {
        this.$Notice.info({
          title: text
        })
        return
      }
      console.log('this.list.form.parameter', this.list.form.parameter)
      let styleParameter = ''
      if (this.list.form.parameter) {
        if (this.list.form.parameter[0]) {
          let _this = this
          let styleParameter_v1 = this.styleList.find(function (item) {
            return item.value == _this.list.form.parameter[0]
          })
          if (styleParameter_v1) {
            styleParameter += styleParameter_v1.label
            if (this.list.form.parameter[1]) {
              styleParameter += ',' + this.list.form.parameter[1]
            }
          }
        }
      }
      console.log(styleParameter)
      let param = {
        keyword: this.list.form.keyword,
        sn: this.list.form.sn,
        title: this.list.form.title,
        parameter: styleParameter,
        thirdPaySn: this.list.form.thirdPaySn,
        receiverInfo: this.list.form.receiverInfo,
        step: this.list.form.afterSaleStatus,
        salesmanSalesId: this.list.form.salesmanSalesId,
        orderSources: this.isNullUndfined(this.list.form.orderSource) ? '' : [this.list.form.orderSource],
        distributorId: this.list.form.distributorId,
        storeId: this.list.form.storeId,
        size: this.list.pageSize,
        current: this.list.currentPage,
        orderStatus: this.orderStatus,
        invite_status: this.list.form.invite_status,
        is_finish: this.list.form.is_finish,
        freightTemplateItemId: this.list.form.freightTemplateId
      }
      if (this.value) {
        param.provinceId = this.value[0]
        param.cityId = this.value[1]
        param.areaId = this.value[2]
      }
      if (this.$route.query.sn) {
        param.sn = this.$route.query.sn
      }
      if (this.list.form.date[0] && this.list.form.date[1] && this.list.form.date.length) {
        param.startTime = formatDate(this.list.form.date[0]) + ' 00:00:00'
        param.endTime = formatDate(this.list.form.date[1]) + ' 23:59:59'
      }
      if (this.singleRowflag) {
        param.singleRowflag = 1
        param.payStatus = 1
      }
      param = clearEmpty(param)
      this.list.status = 'loading'
      this.$ajaxGet('/order/orderList', param).then(data => {
        this.list.data = data.data
        this.list.totalItem = Number(data.total)
        this.list.currentPage = Number(data.current_page)
        let paidu = sessionStorage.getItem('query_order')
        if (paidu) {
          this.onLeaflets({order_id: JSON.parse(paidu).id})
        }
        this.toTop()
        this.list.status = 'pass'
      }).catch(() => {
        this.list.status = 'error'
      })
    },
    onCopy (item) {
      let clipboard = new this.$clipboard('.btn')
      clipboard.on('success', e => {
        this.$Message.success('复制成功')
        clipboard.destroy() //使用destroy可以清除缓存
      })
      clipboard.on('error', e => {
        this.$Message.error('复制失败，请手动复制')
        clipboard.destroy()
      })
    },
    onPageChange (number) {
      this.list.currentPage = number
      this.$router.push({
        name: this.routeLink,
        query: {
          currentPage: this.list.currentPage,
          pageSize: this.list.pageSize
        }
      })
      this.selected = []
      this.getData()
    },
    onPageSizeChange (pageSize) {
      this.list.currentPage = 1
      this.list.pageSize = pageSize
      this.$router.push({
        name: this.routeLink,
        query: {
          currentPage: this.list.currentPage,
          pageSize: this.list.pageSize
        }
      })
      this.getData()
    },
    jumpPage (item, id) {
      if (id == 1) {
        this.$router.push({
          name: "order/order/invitation",
          query: {
            id: item.order_id
          }
        })
      } else {
        this.$router.push({
          name: "order/order/detail",
          query: {
            id: item.order_id
          }
        })
      }

    },
    onClickJoin(item, version_num) {
        this.$router.push({
          name: "order/order/detail",
          query: {
            id: item.order_id,
            version_num: version_num
          }
        })
    },
    onloadDown(item) {
      this.$Modal.confirm({
        title: '下载',
        content: '确定下载吗？',
        onOk: () => {
          // let param =  {order_id: item.order_id, status: 2}
          // let url = 'http://www.yybxk.net/api/order/downZip'
          window.location.href=item.down_url
          // window.open(`${url}?${qs.stringify(param)}`, '_blank');
          // downloadFileStream('/order/downZip', {order_id: item.order_id, status: 2}).then(res => {
            
          // })
          // this.$jsonPost('/order/downZip', {order_id: item.order_id, status: 2}).then(() => {
          //   this.$Notice.success({
          //     title: '下载成功',
          //     desc: `<span class="font-red">${item.order_no}</span> 已下载。`
          //   })
          // })
        }
      })
    },
    onCancel(item) {
      this.$Modal.confirm({
        title: '取消订单',
        content: '确定取消订单吗？',
        onOk: () => {
          this.$jsonPost('/order/applyCancel', {order_id: item.order_id, status: 2}).then(() => {
            this.$Notice.success({
              title: '取消订单成功',
              desc: `<span class="font-red">${item.order_no}</span> 订单已被取消。`
            })
            this.getData()
          })
        }
      })
    },
    onCancelAgree(item) {
      this.$Modal.confirm({
        title: '同意取消订单',
        content: '确定同意取消订单吗？',
        onOk: () => {
          this.$jsonPost('/order/agreeOrder', {order_id: item.order_id, status: 2}).then(() => {
            this.$Notice.success({
              title: '同意取消订单成功',
              desc: `<span class="font-red">${item.order_no}</span> 订单已同意取消。`
            })
            this.getData()
          })
        }
      })
    },
    onInvalid(item) {
      this.$Modal.confirm({
        title: '作废订单',
        content: '确定同意作废订单吗？',
        onOk: () => {
          this.$jsonPost('/order/invalidOrder', {order_id: item.order_id}).then(() => {
            this.$Notice.success({
              title: '同意作废订单成功',
              desc: `<span class="font-red">${item.order_no}</span> 订单已作废。`
            })
            this.getData()
          })
        }
      })
    },
    onReport(item) {
      this.$Modal.confirm({
        title: '打回',
        content: '确定打回改版本吗？',
        onOk: () => {
          this.$jsonPost('/order/repeat', {order_id: item.order_id, status: 2}).then(() => {
            this.$Notice.success({
              title: '打回改版本成功',
              desc: `<span class="font-red">${item.order_no}</span> 已被打回。`
            })
            this.getData()
          })
        }
      })
    },
    onJoinIvalition(item) {
      this.$Modal.confirm({
        title: '邀请',
        content: '确定邀请当前账号？',
        onOk: () => {
          this.$jsonPost('/order/receiveApply', {order_id: item.order_id, status: 2}).then(() => {
            this.$Notice.success({
              title: '邀请成功',
              desc: `<span class="font-red">${item.order_no}</span> 已被邀请。`
            })
            this.getData()
          })
        }
      })
    },
    onComplete(item) {
      this.$Modal.confirm({
        title: '订单完成',
        content: '确定完成该订单吗？',
        onOk: () => {
          this.$jsonPost('/order/finishOrder', {order_id: item.order_id, status: 2}).then(() => {
            this.$Notice.success({
              title: '邀请成功',
              desc: `<span class="font-red">${item.order_no}</span> 已被完成。`
            })
            this.getData()
          })
        }
      })
    },
    onJoinReject(item) {
      this.$Modal.confirm({
        title: '拒绝',
        content: '确定拒绝当前账号？',
        onOk: () => {
          this.$jsonPost('/order/receiveApply', {order_id: item.order_id, status: 3}).then(() => {
            this.$Notice.success({
              title: '拒绝成功',
              desc: `<span class="font-red">${item.order_no}</span> 已被拒绝。`
            })
            this.getData()
          })
        }
      })
    },
    onApplyFinish(item) {
      this.$Modal.confirm({
        title: '申请结单',
        content: '确定申请结单？',
        onOk: () => {
          this.$jsonPost('/order/serviceApplyFinish', {order_id: item.order_id}).then(() => {
            this.$Notice.success({
              title: '申请结单成功',
              desc: `<span class="font-red">${item.order_no}</span> 已申请结单。`
            })
            this.getData()
          })
        }
      })
    },
    onPayment(item) {
      this.$refs.join.openModal(item)
    },
    jumpView(item) {
      this.$refs.view.openModal(item)
    }, 
    jumpMyUpload(item) {
      this.$refs.myUpload1.openModal(item)
    },
    onRemark(item) {
      this.$refs.remark.openModal(item)
    },
    onRemarkList(item) {
      this.$refs.remarkList.openModal(item)
    },
    onMemberList(item) {
      this.$refs.member.open(item)
    },
    onFormJoin(item) {
      this.$refs.formjoin.open(item)
    },
    onLeaflets(item) {
      this.$refs.Leaflets.open(item)
    },
    toTop () {
      let target = document.querySelectorAll('.table-list')[0]
      if (history.state && history.state.scrollTop) {
        target.scrollTop = history.state.scrollTop
      } else {
        target.scrollTop = 0
      }
    },
    scrollHandle(e) {
      history.replaceState({...history.state, scrollTop: e.target.scrollTop}, '')
    },
  },
  computed: {
    ...mapGetters([
      'userInfo'
    ])
  }
}
</script>

<style>
.ivu-cascader .ivu-cascader-menu-item {
  white-space: nowrap
}
.ivu-cascader-menu .ivu-cascader-menu-item i {
  right: 0
}
</style>
